<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
{include file="public/_head"}
<title>添加用户 - H-ui.admin v3.1</title>
	<style>
		.layui-upload-img{
			margin-left: 213px;
		}
	</style>

<link rel="stylesheet" href="/static/lib/layui/css/layui.css" media="all">
</head>
<body>
<article class="page-container">
	<form action="" method="post" class="form form-horizontal" id="gift_add">
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>礼物名称：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value="" placeholder="" id="name" name="name">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>状态：</label>
			<div class="formControls col-xs-8 col-sm-9 skin-minimal">
				<div class="radio-box">
					<input name="status"  value="1"  type="radio" id="status-1" checked>
					<label for="sex-1">启用</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="status-2"  value="0"  name="status">
					<label for="sex-2">弃用</label>
				</div>
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>上传图片</label>

			<div class="layui-upload">
				<button type="button" class="layui-btn" id="test1">上传图片</button>
				<div class="layui-upload-list">
					<img class="layui-upload-img" id="demo1">
					<p id="demoText"></p>
				</div>
			</div>
		</div>

		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>价值：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value=""  onkeyup="num(this)" placeholder="" id="money" name="money">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>经验值：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" name="integral"  onkeyup="num(this)"  id="integral" value="">
				<input type="text" class="input-text" name="icon" id="icon" value="" style="display: none">
			</div>
		</div>
		<div class="row cl">
			<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
				<p type="submit" class="btn btn-success radius" onclick="submit()" id="admin-password-save"><i class="icon-ok"></i> 确定</p>
			</div>
		</div>
	</form>
</article>

<!--_footer 作为公共模版分离出去-->
{include file="public/_footer" /}
 <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script src="/static/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/static/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript">
    $(function(){
        $('.skin-minimal input').iCheck({
            checkboxClass: 'icheckbox-blue',
            radioClass: 'iradio-blue',
            increaseArea: '20%'
        })});

    function submit() {
        var name = $("input[ name='name']").val();
        var money = $('input[name="money"]').val();
        var integral = $("input[ name='integral']").val();
        var status = $('input:radio[name=status]:checked').val();
        var icon = $("input[ name='icon']").val();
            $.ajax({
                type: 'POST',
                url: "{:url('gift/giftAdd')}",
                data:{
                    name:name,
                    money:money,
                    integral:integral,
                    status:status,
                    icon:icon,
                },
                dataType: 'json',
                success: function(data){
                    var message = $.parseJSON(data).message;
                    var status = $.parseJSON(data).status;
                    if (status == 1){
                        layer.msg(message,{icon:1,time:1000});
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(index);
                    } else{
                        layer.msg(message,{icon:5,time:1000});
                    }
                },
                error:function(data) {
                    console.log(data.message);
                },
            });
		}

    function num(obj){
        obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
        obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字
        obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个, 清除多余的
        obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
        obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //控制可输入的小数
    }

layui.use('upload', function() {
    var $ = layui.jquery
        , upload = layui.upload;

    //普通图片上传
    var uploadInst = upload.render({
        elem: '#test1'
        , url: "{:url('Upload/aloneUpload')}"
        , before: function (obj) {
            //预读本地文件示例，不支持ie8
            obj.preview(function (index, file, result) {
                $('#demo1').attr('src', result); //图片链接（base64）
                $("#demo1").css("width","130px")//设置test下的图片宽为30px
                $("#demo1").css("height","130px")//设置test下的图片高为30px
            });
        }
        , done: function (res) {
            //如果上传失败
            if (res.code <= 0) {
                return layer.msg('上传失败');
            }
            //上传成功
            if (res.code > 0) {
                $('#icon').val(res.data.src);
                return layer.msg('上传成功');
            }
        }
        , error: function () {
            //演示失败状态，并实现重传
            var demoText = $('#demoText');
            demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
            demoText.find('.demo-reload').on('click', function () {
                uploadInst.upload();
            });
        }
    });
});
</script> 
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>